<template>
  <div class="homeCoupon">
    <div class="dash_wrapper">
      <div class="dash"></div>
    </div>
    <div class="coupon_item">
      <div class="tit">{{coupon.name}}</div>

      <div class="price">
        ￥<span>{{coupon.money}}</span> 
        <span v-if="coupon.type!='direct'">满{{coupon.satisfy_money}}可用</span>
        <span v-else> 无门槛</span>
      </div>
      <div class="time">
        <span>有限期</span>
        <span>{{coupon.start_time}}</span>至
        <span>{{coupon.end_time}}</span>
      </div>
    </div>
    <div class="tip">
      <div class="tip_tit">使用说明</div>
      <div>不可抵运费</div>
    </div>
    <div class="btn" @click="commit" v-if="coupon.is_receive=='no'">点击领取</div>
    <div class="btn btn_get"  v-else-if="coupon.is_receive=='yes'">已领取</div>
  </div>
</template>

<script>

export default {
  data(){
    return{
      id:'',
      coupon:'',
    }
  },

  methods: {
    // sliceTime(val){
    //   let pattern=/\d*-\d*-\d*/
    //   let val1=val.map(item=>{
    //    item['start_time']= item['start_time'].match(pattern)[0];
    //    item['end_time']= item['end_time'].match(pattern)[0]
    //    return item
    //   })
    //   this.couponList=val1;
    // },
    async getCoupon(){
      let userToken=wx.getStorageSync('userToken')
      let res= await this.$request.getData('/ucenter/getCouponDetail',{user_token:userToken,coupon_id:this.id})
      if(res.data.level=='success'){
        let res1=res.data.data;
        res1.start_time=res1.start_time.split(' ')[0]
        res1.end_time=res1.end_time.split(' ')[0]
        this.coupon=res1
        // this.sliceTime(res1)
      }
    },
    async commit(){
      let userToken=wx.getStorageSync('userToken')
      const res=await this.$request.postData('/ucenter/couponReceive',{
        user_token:userToken,
        coupon_id:this.id
      })
      if(res.data.level=='success'){
        this.$currency.showToast(res.data.message)
      }else{
        this.$currency.showToast(res.data.message)
      }
      this.getCoupon()
    }

  },
     onShareAppMessage(){
     return {
      title: 'F6能量饮微商城',
      desc:'F6功能饮、提神饮、醒酒、解酒能量饮微商城',
    }
  },
  onLoad(options){
      this.id=options.id
      this.getCoupon()
  }
}
</script>

<style scoped lang="scss">
  .homeCoupon{
    width:100%;
    background: #eee;
    min-height: 100%;
    
  }
  .dash_wrapper{
    padding-top:20px;
  }
  .dash{
    margin:0 20px;
    height:5px;
    background-image: linear-gradient(to right, #fff 50%, pink 50%);
    background-size: 10px 5px;
    background-repeat: repeat-x;

  }
  .coupon_item{
    margin:0 20px;
    color:#fff;
    background:pink;
    padding:10px;
    .tit{
      margin-top:20px;
    }
  }
  .price{
    margin-top: 60px;
    margin-bottom: 20px;
    & span:nth-child(1){
      font-size: 20px;
    }
  }
  .tip{
    margin:0 20px;
    background: #fff;
    padding: 5px;
    .tip_tit{
      color:black;
      margin-bottom: 5px;
    }
  }
  .btn{
    margin:20px auto;
    text-align: center;
    width: 280px;
    color:#fff;
    font-size: 20px;
    padding:7px 0;
     background: rgb(55, 173, 55);
     border-radius:10px; 
  }
  .btn_get{
    background: gray;
  }
</style>
